<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>产品筛选</title>
    <link href="css/reset.css" rel="stylesheet" />
    <link href="css/common.css" rel="stylesheet" />
    <link href="css/main.css" rel="stylesheet" />
  </head>
  <body>
    <div class="box">
      <div class="headerBar">
        <div class="topBar">
          <div class="comWidth">
            <div class="leftArea">
              <a href="#" class="collection">收藏慕课</a>
            </div>
            <div class="rightArea">
              <span>欢迎来到慕课网</span>
              <a href="login.html">[登录]</a>
              <a href="register.html">[免费注册]</a>
            </div>
          </div>
        </div>
        <!--购物车区域-->
        <div class="logoBar">
          <div class="comWidth">
            <div class="logo fl">
              <a href="#"><img src="img/logo.png" alt="慕课网"></a>
            </div>
            <div class="search_box fl">
              <input type="text" class="search_text fl" />
              <input type="button" class="search_btn fr" value="搜索" />
            </div>
            <div class="shopCar fr">
              <span class="shopText fl">购物车</span>
              <span class="shopNum fl">0</span>
            </div>
          </div>
        </div>
        <!--导航区-->
        <div class="navBox">
          <div class="comWidth">
            <div class="shopClass fl">
              <h3>全部商品分类<i></i></h3>
            </div>
            <ul class="nav fl">
              <li>
                <a href="#" class="active">数码城</a>
              </li>
              <li>
                <a href="#">天嘿嘿</a>
              </li>
              <li>
                <a href="#">团购</a>
              </li>
              <li>
                <a href="#">发现</a>
              </li>
              <li>
                <a href="#">二手特卖</a>
              </li>
              <li>
                <a href="#" class="nobor">名品会</a>
              </li>
            </ul>
          </div>
        </div>
      </div>

      <div class="hr_15"></div>

      <!--Banner部分-->
      <div class="comWidth clearfix products">
        <div class="leftArea">
          <div class="leftNav vertical">
            <h3 class="nav-title">产品分类</h3>
            <div class="nav-cont">
              <h3>手机通讯</h3>
              <ul class="navCont-list clearfix">
                <li>
                  <a href="#">手机</a>
                </li>
                <li>
                  <a href="#">对讲机</a>
                </li>
              </ul>
            </div>
            <div class="nav-cont">
              <h3>运营商</h3>
              <ul class="navCont-list clearfix">
                <li>
                  <a href="#">购机送费</a>
                </li>
                <li>
                  <a href="#">"0"元购机</a>
                </li>
                <li>
                  <a href="#">选号入网</a>
                </li>
              </ul>
            </div>
            <div class="nav-cont">
              <h3>手机配件</h3>
              <ul class="navCont-list clearfix">
                <li>
                  <a href="#">手机电池</a>
                </li>
                <li>
                  <a href="#">蓝牙耳机</a>
                </li>
                <li>
                  <a href="#">充电器/数据线</a>
                </li>
                <li>
                  <a href="#">手机耳机</a>
                </li>
                <li>
                  <a href="#">手机贴膜</a>
                </li>
                <li>
                  <a href="#">手机存储卡</a>
                </li>
                <li>
                  <a href="#">手机保护套</a>
                </li>
                <li>
                  <a href="#">车载配件</a>
                </li>
                <li>
                  <a href="#">iPhone 配件</a>
                </li>
              </ul>
            </div>
          </div>
        </div>
        <!--右边商品-->
        <div class="rightArea">
          <div class="screening_box">
            <dl class="screening clearfix">
              <dt>手机</dt>
              <dd class="limit">
                <a href="#" class="active">不限</a>
              </dd>
              <dd class="screening_list">
                <ul class="clearfix">
                  <li>
                    <a href="#">Samsung/三星</a>
                  </li>
                  <li>
                    <a href="#">Apple/苹果</a>
                  </li>
                  <li>
                    <a href="#">Huawei/华为</a>
                  </li>
                  <li>
                    <a href="#">Samsung/三星</a>
                  </li>
                  <li>
                    <a href="#">Apple/苹果</a>
                  </li>
                  <li>
                    <a href="#">Huawei/华为</a>
                  </li>
                </ul>
              </dd>
            </dl>
            <dl class="screening clearfix">
              <dt>手机</dt>
              <dd class="limit">
                <a href="#">不限</a>
              </dd>
              <dd class="screening_list">
                <ul class="clearfix">
                  <li>
                    <a href="#">Samsung/三星</a>
                  </li>
                  <li>
                    <a href="#">Apple/苹果</a>
                  </li>
                  <li>
                    <a href="#">Huawei/华为</a>
                  </li>
                  <li>
                    <a href="#" class="active">Samsung/三星</a>
                  </li>
                  <li>
                    <a href="#">Apple/苹果</a>
                  </li>
                  <li>
                    <a href="#">Huawei/华为</a>
                  </li>
                  <li>
                    <a href="#">Samsung/三星</a>
                  </li>
                  <li>
                    <a href="#">Apple/苹果</a>
                  </li>
                  <li>
                    <a href="#">Huawei/华为</a>
                  </li>
                  <li>
                    <a href="#">Samsung/三星</a>
                  </li>
                  <li>
                    <a href="#">Apple/苹果</a>
                  </li>
                  <li>
                    <a href="#">Huawei/华为</a>
                  </li>
                </ul>
              </dd>
            </dl>
            <dl class="screening clearfix">
              <dt>手机</dt>
              <dd class="limit">
                <a href="#" class="active">不限</a>
              </dd>
              <dd class="screening_list">
                <ul class="clearfix">
                  <li>
                    <a href="#">Samsung/三星</a>
                  </li>
                  <li>
                    <a href="#">Apple/苹果</a>
                  </li>
                  <li>
                    <a href="#">Huawei/华为</a>
                  </li>
                  <li>
                    <a href="#">Samsung/三星</a>
                  </li>
                  <li>
                    <a href="#">Apple/苹果</a>
                  </li>
                  <li>
                    <a href="#">Huawei/华为</a>
                  </li>
                </ul>
              </dd>
            </dl>
            <dl class="screening clearfix">
              <dt>更多选项</dt>
              <dd class="screening_list">
                <div class="screen_more">
                  <a href="#">CPU核心数</a>
                </div>
                <div class="screen_more">
                  <a href="#">主摄像头像素</a>
                </div>
              </dd>
            </dl>
          </div>

          <div class="hr_15"></div>
          <div class="addInfo clearfix">
            <div class="address">
              <span class="add_text">送至：</span>
              <div class="select">
                <h3>海定区五环内</h3>
                <span></span>
                <ul class="show_select">
                  <li>上帝</li>
                  <li>五道口</li>
                  <li>朝阳区</li>
                </ul>
              </div>
            </div>
            <div class="fr screen_text">
              <span class="check">
	        			<input type="checkbox" id="check" />
	        			<label for="check">仅显示有货</label>
	        		</span>
              <span class="shop_number">
	        			共<em>212</em>件
	        		</span>
            </div>
          </div>

          <div class="products_list screening_list_more clearfix">
            <div class="item">
              <div class="item_cont">
                <div class="img_item">
                  <a href="#"><img src="img/shopImg.png" alt="" /></a>
                </div>
                <p>
                  <a href="#">小米 红米 3G(GSM/TD-SCDMA) 手机 灰色</a>
                </p>
                <p class="psecond">
                  <span class="money">￥699.00</span>
                  <span class="pcomment">4886</span>
                  <a href="#">评论</a>
                </p>
                <p>
                  <a href="#" class="addCar">加入购物车</a>
                </p>
              </div>
            </div>
            <div class="item">
              <div class="item_cont">
                <div class="img_item">
                  <a href="#"><img src="img/shopImg.png" alt="" /></a>
                </div>
                <p>
                  <a href="#">小米 红米 3G(GSM/TD-SCDMA) 手机 灰色</a>
                </p>
                <p class="psecond">
                  <span class="money">￥699.00</span>
                  <span class="pcomment">4886</span>
                  <a href="#">评论</a>
                </p>
                <p>
                  <a href="#" class="addCar">加入购物车</a>
                </p>
              </div>
            </div>
            <div class="item">
              <div class="item_cont">
                <div class="img_item">
                  <a href="#"><img src="img/shopImg.png" alt="" /></a>
                </div>
                <p>
                  <a href="#">小米 红米 3G(GSM/TD-SCDMA) 手机 灰色</a>
                </p>
                <p class="psecond">
                  <span class="money">￥699.00</span>
                  <span class="pcomment">4886</span>
                  <a href="#">评论</a>
                </p>
                <p>
                  <a href="#" class="addCar">加入购物车</a>
                </p>
              </div>
            </div>
            <div class="item">
              <div class="item_cont">
                <div class="img_item">
                  <a href="#"><img src="img/shopImg.png" alt="" /></a>
                </div>
                <p>
                  <a href="#">小米 红米 3G(GSM/TD-SCDMA) 手机 灰色</a>
                </p>
                <p class="psecond">
                  <span class="money">￥699.00</span>
                  <span class="pcomment">4886</span>
                  <a href="#">评论</a>
                </p>
                <p>
                  <a href="#" class="addCar">加入购物车</a>
                </p>
              </div>
            </div>
            <div class="item">
              <div class="item_cont">
                <div class="img_item">
                  <a href="#"><img src="img/shopImg.png" alt="" /></a>
                </div>
                <p>
                  <a href="#">小米 红米 3G(GSM/TD-SCDMA) 手机 灰色</a>
                </p>
                <p class="psecond">
                  <span class="money">￥699.00</span>
                  <span class="pcomment">4886</span>
                  <a href="#">评论</a>
                </p>
                <p>
                  <a href="#" class="addCar">加入购物车</a>
                </p>
              </div>
            </div>
            <div class="item">
              <div class="item_cont">
                <div class="img_item">
                  <a href="#"><img src="img/shopImg.png" alt="" /></a>
                </div>
                <p>
                  <a href="#">小米 红米 3G(GSM/TD-SCDMA) 手机 灰色</a>
                </p>
                <p class="psecond">
                  <span class="money">￥699.00</span>
                  <span class="pcomment">4886</span>
                  <a href="#">评论</a>
                </p>
                <p>
                  <a href="#" class="addCar">加入购物车</a>
                </p>
              </div>
            </div>
            <div class="item">
              <div class="item_cont">
                <div class="img_item">
                  <a href="#"><img src="img/shopImg.png" alt="" /></a>
                </div>
                <p>
                  <a href="#">小米 红米 3G(GSM/TD-SCDMA) 手机 灰色</a>
                </p>
                <p class="psecond">
                  <span class="money">￥699.00</span>
                  <span class="pcomment">4886</span>
                  <a href="#">评论</a>
                </p>
                <p>
                  <a href="#" class="addCar">加入购物车</a>
                </p>
              </div>
              <div class="hot"></div>
            </div>
            <div class="item">
              <div class="item_cont">
                <div class="img_item">
                  <a href="#"><img src="img/shopImg.png" alt="" /></a>
                </div>
                <p>
                  <a href="#">小米 红米 3G(GSM/TD-SCDMA) 手机 灰色</a>
                </p>
                <p class="psecond">
                  <span class="money">￥699.00</span>
                  <span class="pcomment">4886</span>
                  <a href="#">评论</a>
                </p>
                <p>
                  <a href="#" class="addCar">加入购物车</a>
                </p>
              </div>
            </div>
            <div class="item">
              <div class="item_cont">
                <div class="img_item">
                  <a href="#"><img src="img/shopImg.png" alt="" /></a>
                </div>
                <p>
                  <a href="#">小米 红米 3G(GSM/TD-SCDMA) 手机 灰色</a>
                </p>
                <p class="psecond">
                  <span class="money">￥699.00</span>
                  <span class="pcomment">4886</span>
                  <a href="#">评论</a>
                </p>
                <p>
                  <a href="#" class="addCar">加入购物车</a>
                </p>
              </div>
            </div>
          </div>

          <div class="hr_25"></div>
          <div class="page">
            <a href="#">上一页</a>
            <a href="#">1</a>
            <a href="#">2</a>
            <a href="#">3</a>
            <a href="#">4</a>
            <a href="#">5</a>
            <a href="#">6</a>
            <span class="hl">...</span>
            <a href="#">200</a>
            <a href="#">下一页</a>
            <span class="morePage">共200页，到第&nbsp;</span>
            <input type="text" />&nbsp;页&nbsp;
            <input type="button" value="确定" />
          </div>
        </div>
      </div>

      <div class="hr_25"></div>
      <!--底部区-->
      <div class="footer">
        <p>
          <a href="#">慕课简介</a>
          <i>|</i>
          <a href="#">慕课公告</a>
          <i>|</i>
          <a href="#">招纳贤士</a>
          <i>|</i>
          <a href="#">联系我们</a>
          <i>|</i>
          <a href="#">客服热线：400-675-1234</a>
        </p>
        <p>
          Copyright © 2006 - 2014 慕课版权所有&nbsp;&nbsp;&nbsp;京ICP备09037834号 &nbsp;&nbsp;&nbsp;某市公安局龙潭分局备案编号：32432421231
        </p>
        <p class="web">
          <a href="#"><img src="img/webLogo.png" alt="logo"></a>
          <a href="#"><img src="img/webLogo.png" alt="logo"></a>
          <a href="#"><img src="img/webLogo.png" alt="logo"></a>
          <a href="#"><img src="img/webLogo.png" alt="logo"></a>
        </p>
      </div>
    </div>
  </body>
</html>